Skip to content

addRoutes: optional parameter overwriteNames #1129

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 16 commits into from

Conversation

laurentpayot
Copy link
Contributor

Simply added an optional boolean parameter overwriteNames to the addRoute function.
When this parameter is set to true, adding a route with a duplicate name will be allowed and replace the name entry in nameMap.

This tiny change has great effects because it allows dynamic url translations (as long as the links use route names instead of pathes).
For instance:
mysite.com/en/records (routes names with English urls)
mysite.com/fr/enregistrements (after routes names overwritten with French urls)

Overwriting route names was the default behaviour of vue-router 1.X router.on(), and this was the only way I have ever found to achieve dynamic url translations.
Lots of people in non-english speaking countries need url translation, because english names are sometimes not obvious for them, and because of SEO reasons too.

I also fixed a typo in the existing docs of addRoutes.

Let me know if you want me to document this new parameter, I'd be glad to make a PR.

Laurent.

@posva
Copy link
Member

posva commented Jan 30, 2017

@fnlctrl @yyx990803 If other parameters may arise in the future, we should use an object instead of a boolean

@yyx990803
Copy link
Member

I'm a bit confused by your use case. By "dynamic url translations" do you mean the user picks a different language after the app starts? Can you provide more details e.g. what the usage code looks like?

@laurentpayot
Copy link
Contributor Author

laurentpayot commented Jan 30, 2017

@yyx990803 yes exactly. Here is an example jsfiddle: https://jsfiddle.net/3r9oh2mz/48/

In this example if the overwriteNames parameter was set to true then after you click on the 'fr' button there would be no warning messages in the console, the 'home' route url would be /#/fr and the 'about' route url would be /#/fr/a-propos.

@laurentpayot
Copy link
Contributor Author

laurentpayot commented Feb 5, 2017

I forgot addRouteRecord was recursive. Added a nested route test. Everything should be fine now.

@varHarrie varHarrie mentioned this pull request Feb 15, 2017
@joelmandell
Copy link

Hello dear friends! Have I totally missed something or is this not pulled yet? And if so, why not yet?

@laurentpayot
Copy link
Contributor Author

laurentpayot commented Apr 4, 2017

@posva @fnlctrl @yyx990803 If this way of dynamically translating urls is considered too hacky/dirty no worries just let me know and I will close this PR and open an issue for a "dynamic url translations" feature request instead. But only if that's not a way to bury this feature 😉

@joelmandell
Copy link

Well I am not sure If i am qualifed to say if it is hacky. But might git clone this and try tomorrow. :)

@laurentpayot
Copy link
Contributor Author

laurentpayot commented Apr 14, 2017

2.4.0 added a new parameter in addRouteRecord, this is getting too complex to be safe. I'm closing this PR, feature request #1234 is similar.
@joelmandell @tinchox5 if you're using webpack you can make dynamic url translations work (as described in https://jsfiddle.net/3r9oh2mz/48/) by modifiying "normal" vue-router build files with the following command:

sed -ri 's/if\ \(!nameMap\[name\]\)/if (true)/' node_modules/vue-router/dist/*.js

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants